- max_topic_title_length = 30
- detail_page_link = topic_explore_projects_cleaned_path(topic_name: topic.name)

.col-lg-3.col-md-4.col-sm-12
  = render Pajamas::CardComponent.new(card_options: { class: 'gl-mb-5' },
                                      body_options: { class: 'gl-display-flex gl-align-items-center' }) do |c|
    - c.with_body do
      = link_to detail_page_link do
        = render Pajamas::AvatarComponent.new(topic, size: 48, alt: '', class: 'gl-mr-3')
      = link_to detail_page_link do
        - if topic.title_or_name.length > max_topic_title_length
          %h5.gl-str-truncated.has-tooltip{ title: topic.title_or_name }
            = truncate(topic.title_or_name, length: max_topic_title_length)
        - else
          %h5
            = topic.title_or_name
